<template>
	<view>
		<cu-custom :isBack="true" bgColor="bg-blue">
			<block slot="content">我的</block>
		</cu-custom>
		<view class="">
			<!-- 个人头像 -->
			<view class="flex person-img bg-blue">
				<!-- style="background-image:url(../../static/img/peopleImg.jpeg);" -->
				<view class="cu-avatar radius lg">
					<text class="ph-touxiang text-blue"></text>
				</view>
				<view class="padding-lr-30 u-font-weight6 margin-tb-auto">
					<view class="text-white u-font-weight7 font-size34 margin-b-10">{{this.$store.state.userName}}</view>
					<view class="text-white u-font-weight4 font-size24">联系方式:暂无信息</view>
				</view>
			</view>
		</view>
		<view  class="padding-t">
			<view class="bg-white">
				<view class="flex perison-list-item padding-lr-30 font-size28 dashed-bottom" @tap="handleChangePass">
					<text class="ph-zhanghaoguanli font-size50 text-yellow"></text>
					<text class="margin-left u-font-weight ">账号管理</text>
				</view>
				<view class="flex perison-list-item padding-lr-30 font-size28 dashed-bottom" @click="handleClick" data-target="Modal">
					<text class="ph-banbengengxin font-size50 text-blue"></text>
					<text class="margin-left u-font-weight">版本更新</text>
				</view>
				<view class="flex perison-list-item padding-lr-30 font-size28 dashed-bottom" @tap="handleAbout">
					<text class="ph-guanyuwomen font-size50 text-green"></text>
					<text class="margin-left u-font-weight">关于我们</text>
				</view>
				<view class="flex perison-list-item padding-lr-30 font-size28" @tap="handleSignOut">
					<text class="ph-tuichu font-size50 text-red"></text>
					<text class="margin-left u-font-weight">退出登录</text>
				</view>
			</view>
		</view>
		
		<!-- 下载弹窗 -->
		<view class="cu-modal" :class="modalName=='Modal'?'show':''">
			<view class="cu-dialog bg-white">
				<view class="padding-xl">
					是否要进行版本更新？
				</view>
				<view class="flex solid-top">
					<view class="text-blue updateBtn" @tap="closeUpdate">稍后再说</view>
					<view class="text-blue updateBtn" @tap="updateApp">立即更新</view>
				</view>
			</view>
		</view>
		<!-- 更新进度 -->
		<view class="cu-modal" :class="modalName=='Update'?'show':''">
			<view class="cu-dialog bg-white">
				<view class="cu-bar bg-white justify-end">
					<view class="content">下载进度</view>
				</view>
				<view class="padding update-progress">
					<view class="cu-progress round sm">
						<view class="bg-blue" :style="{width: width + '%'}"></view>
					</view>
					<view class="text-right">{{width}}%</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { post } from "@/lib/Util.js";
	export default {
		data() {
			return {
				modalName: '',
				width: 0,
			}
		},
		methods: {
			// 关闭更新
			closeUpdate() {
				this.modalName = null
			},
			updateApp() {
				this.modalName = null
				this.modalName = 'Update'
				let self = this
				// #ifdef APP-PLUS 
				plus.runtime.getProperty(plus.runtime.appid, function(widgetInfo) {
					
					const downloadTask =  uni.downloadFile({
						url: 'http://221.5.224.33:10001/apk/ph.wgt',
						success: (downloadResult) => {
							 plus.runtime.install(downloadResult.tempFilePath,{  
								   force: false  
							}, function() {  
								   console.log('install success...');  
								   plus.runtime.restart();  
							}, function(e) {  
								   console.error('install fail...');  
							})
						}
					})
					downloadTask.onProgressUpdate((res) => {
						self.width = res.progress
					    // 测试条件，取消下载任务。
					    if ( res.progress == 100 ) {
					        downloadTask.abort();
							self.modalName = null
					    }
					});
				})
				// #endif
			},
			handleClick(e) {
				uni.showToast({
				    title: '已是最新版本',
					icon: 'none',
					position: 'bottom',
				    duration: 2000
				});
				
				// this.modalName = e.currentTarget.dataset.target
				// post('/apk/update', {
				// 	name: '',
				// 	version: ''
				// }).then(res => {
					
				// })
				
			},
			// 关于我们
			handleAbout() {
				uni.navigateTo({
					url: '/pages/person/about'
				})
			},
			// 账号管理
			handleChangePass() {
				uni.navigateTo({
					url: '/pages/changepass/changepass'
				})
			},
			handleSignOut() {
				var self = this
				uni.showModal({
					title: '是否退出应用？',
					showCancel: true,
					cancelText: '取消',
					success: function (res) {
						if (res.confirm) {
							self.$store.commit('logout')
							uni.reLaunch({
								url: '/pages/login/login',
							})
							// // #ifdef APP-PLUS
							// try{
							// 	if (uni.getSystemInfoSync().platform=='ios'){
							// 		const threadClass = plus.ios.importClass("NSThread");
							// 		const mainThread = plus.ios.invoke(threadClass, "mainThread");
							// 		plus.ios.invoke(mainThread, "exit");
							// 	//plus.ios.import("UIApplication").sharedApplication().performSelector("exit")
							// 	} else if (uni.getSystemInfoSync().platform=='android'){
							// 		plus.runtime.quit();
							// 	}
							// }catch(err) {
							// 	uni.reLaunch({
							// 		url: '/pages/login/login',
							// 	});
							// }
							// // #endif
							
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				})
			}
		}
	}
</script>

<style>
	.person-img {
		padding: 20upx 30upx;
	}
	.perison-list-item {
		height: 130upx;
		line-height: 130upx;
	}
	.perison-list-item:last-child {
		border: none;
	}
	.updateBtn {
		width: 50%;
		height: 100upx;
		line-height: 100upx;
		text-align: center;
		font-size: 35upx;
		font-weight: 700;
	}
	.updateBtn:first-child {
		border-right: 1px solid rgba(0,0,0,0.1);
	}
</style>
